import {render,WeElement,define} from "omi"
import  "./index.css"

//获取应用实例
const app =getApp()

import { get } from '../../../utils/util'
import api from '../../../api/api.js'


define('index_page', class extends WeElement{
    config={
        navigationBarTitleText:"景区名称"
    }
    data={
        ticket:[0,1,2],
        // imageUrl:require("../../../images/zy-3.png"),
        ticket_time:[0,1,2],
        autoplay: true,
        circular: true,
        scenic_id:"",
        carousel_list:[],
        scenic_detail:"",
        ticket_list:"",
        origin_label:[],
    }
    todescribe=(e)=>{
        console.log(e);
        wx.navigateTo({
          url: "../detail/index?scenic_id=" + e.currentTarget.dataset.id
        })
    }

    map=()=>{
        wx.openLocation({
            latitude :29.2491900000,
            longitude : 115.5012880000,
            scale:15,
            name:'瑶池湾路亚垂钓基地'
        })
    }


    install(option){
        console.log(option);
        get(api.get_scenic_detail,{
          scenic_id: option.scenic_id
        })
        .then((res)=>{
          console.log(res);
          this.data.scenic_id = res.data.scenic_id;//id
          this.data.carousel_list = res.data.carousel_list;//轮播图列表
          this.data.scenic_detail = res.data.scenic_detail;//名称、详情
          this.data.ticket_list = res.data.ticket_list;//门票

          for (let i = 0; i < this.data.ticket_list.length;i++){
            this.data.ticket_list[i].origin_label = this.data.ticket_list[i].origin_label.split("++");//门票标签
          }
          
          
          this.update();
        })
      
        // this.data.imageUrl=option.target_url;
        this.update();
    }

    render(){
        return(
            <view class="bg">
            <view class="index_body">

            <view class="park">
                <view class="park_pic">
                  <swiper autoplay={autoplay} circular={circular}>
                    {
                      carousel_list.map((ele, idx) => {
                        return <swiper-item key={idx}>
                          <image src={ele}></image>
                        </swiper-item>
                      })
                    }
                  </swiper>
                </view>
                

                <view class="desc_box">
                    <view class="desc_cont">
                    <view class="park_name">{scenic_detail.scenic_name}</view>
                        <view class="share">分享</view>
                    </view>

                    <view class="desc_cont">
                        <view class="park_desc">景区详情</view>
                    <view class="tex ell" bindtap="todescribe" data-id={scenic_id}>{scenic_detail.describe}</view>
                    </view>

                    <view class="desc_cont">
                        <view class="park_desc">景区位置</view>
                        <view class="map" bindtap='map'>地图</view>
                    </view>
                </view>
            </view>

            <view class="ticket_box">
            <view class="ticket_title">官方门票</view>
              {
                    ticket_list.map((item,index)=>
              <view class="ticket_item" key={index}>
                <view class="ticket_adult">{item.ticket_name}</view>
                <view class="ticket">
                  <view class="ticket_time">
                  {
                    item.origin_label.map((ele,i)=>
                      <view class="t_time" key={i}>{ele}</view>
                      )
                  }
                  </view>
                  <view class="ticket_pay">
                    <view class="price">
                      <view class="dollar">￥</view>
                      {item.price}
                      <view class="s">起</view>
                    </view>
                    <view class="pay_box">
                      <view class="pay">立即购买</view>
                    </view>
                  </view>
                </view>

                <view class="sell">
                  <view class="selled">已售{item.sale_num}</view>
                  <view class="symbols">|</view>
                  <view class="sell_note">购买须知></view>
                </view>
              </view>
              )}
            </view>


            </view>
            </view>
        )
    }

})

